<template>
	<view class="">
		<div class="xjsy">
			<div class="xjsy_tit">
				<ul>
					<li :class="{cur:currMenu=='quan'}" @click="currMenu='quan'"><span>积分收益</span></li>
					<li :class="{cur:currMenu=='balance'}" @click="currMenu='balance'"><span>现金收益</span></li>
				</ul>
			</div>
			<div class="xjsy_nr">
				<div class="xjsybox" v-if="currMenu=='quan'">
					<ul class="home-menu">
						<li>
							<navigator url="/subPackages/my/coupon_detail">
								<a href="javascript:">
									<p>
										<image mode="widthFix" class="uni-img-tag"
											src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/a4.png">
										</image>
										购物金积分
									</p>
									<h2 class="text">
										<text class="sm">余额：</text> 
										<text class="sm fh">¥</text> 
										{{userInfo.amount.tradeAvaibleAmount||"0.00"}}
									</h2>
									<h2 class="text text2">
										<text class="sm">累计：</text> 
										<text class="sm fh">¥</text> 
										{{userInfo.amount.tradeTotalAmount||"0.00"}}
									</h2>
								</a>
							</navigator>
						</li>
						<li>
													<navigator url="/subPackages/my/coupon_detail">
														<a href="javascript:">
															<p>
																<image mode="widthFix" class="uni-img-tag"
																	src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/a3.png">
																</image>
																创业金积分
															</p>
															<h2 class="text">
																<text class="sm">余额：</text> 
																<text class="sm fh">¥</text> 
																{{userInfo.amount.codePlateAvaibleAmount||"0.00"}}
															</h2>
															<h2 class="text text2">
																<text class="sm">累计：</text> 
																<text class="sm fh">¥</text> 
																{{userInfo.amount.codePlateTotalAmount||"0.00"}}
															</h2>
														</a>
													</navigator>
												</li>
					</ul>
				</div>
				<div class="xjsybox" v-if="currMenu=='balance'">
					<ul>
						<li class="balance">
							<navigator url="/subPackages/my/cash_detail">
								<a href="javascript:">
									<!-- <p>
										账户余额（元）
									</p> -->
									<h2>
										<text class="sm">账户余额：</text> 
										<text class="sm fh">¥</text>
										{{ userInfo.amount.cashRewardAvaibleAmount ||"0.00"}}
									</h2>
									<h2 class="hss">
										<text class="sm">累计：</text> 
										<text class="sm fh">¥</text>
										{{ userInfo.amount.cashRewardTotalAmount ||"0.00"}}
									</h2>
								</a>
							</navigator>
							<navigator class="get-cash-btn" url="/subPackages/my/get_cash">提现</navigator>
						</li>

					</ul>
				</div>
			</div>
			<div class="wzgg">
				<div class="wzgg_left">
					<p>公告</p>
				</div>
				<div class="wzgg_right">
					<zs-marquee :title="noticeContent" ref="marquee" />
				</div>
			</div>
			<view class="fhlianjie">
				<navigator url="/pages/data/merchat/merchat" class="item">
					<view class="imgbox">
						<image mode="widthFix" class="img" src="/static/imgs/mc.png"></image>
					</view>
					<text class="name">团队分红</text>
				</navigator>
				<navigator url="/pages/data/user/user" class="item">
					<view class="imgbox">
						<image mode="widthFix" class="img" src="/static/imgs/user.png"></image>
					</view>
					<text class="name">我的团队</text>
				</navigator>
			</view>
			<view class="yqmbxo">
				<text class="txt">易启付限量招募100万合伙人邀你加盟</text>
				<navigator class="btn" url="/pages/index/share_code">邀请码</navigator>
			</view>
			<div class="tdjy">
				<div class="tdjybox">
					<h2>团队累计交易(本月)</h2>
					<div class="tdjy_nr">
						<ul>
							<li>
								<h3>团队累计交易量 (上月)</h3>
								<p>{{info.statLastMonthOrderAmount||"0.00"}}</p>
							</li>
							<li @click="jumpMemberCommodityActiveList('yesterday')">
								<h3>昨日激活量 </h3>
								<p>{{info.statYesterdayActiveCount||"0.00"}}</p>
							</li>
							<li>
								<h3>团队累计交易量 (今日)</h3>
								<p>{{info.statTodayOrderAmount||"0.00"}}</p>
							</li>
							<li @click="jumpMemberCommodityActiveList('today')">
								<h3>今日激活量 </h3>
								<p>{{info.statTodayActiveCount||"0.00"}}</p>
							</li>
						</ul>
					</div>
				</div>
				<div class="tdjybox">
					<h2>7天交易量(万元)</h2>
					<div class="qtjy">
						<!-- <image mode="widthFix" class="uni-img-tag" src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/a56.png"></image> -->
						<qiun-data-charts :opts="charOpt" type="line" :chartData="lineData" />
					</div>
				</div>
				<div class="tdjybox">
					<h2>7天激活量</h2>
					<div class="jysl">
						<!-- <image mode="widthFix" class="uni-img-tag" src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/a6.png"></image> -->
						<view class="char">
							<qiun-data-charts :opts="charOpt" type="column" :chartData="charData" />
						</view>

					</div>
				</div>
			</div>
		</div>
		<uni-popup ref="popup" type="center">
			<view class="hb-popuo" :style="{height:systemInfo.windowHeight+'px'}">
				<view class="main" v-if="hbAmount===0" @click="collectDayProfit">
					<text class="text">送你一个红包</text>
					<text class="text">点击领取</text>
				</view>
				<view class="main" v-if="hbAmount!==0">
					<text class="text amount">+{{hbAmount}}</text>
					<text class="text">领取成功</text>
				</view>
				<uni-icons @click="closePopup" class="close" type="close" size="40" color="#ffffff"></uni-icons>

			</view>
		</uni-popup>

		<!-- <popup2></popup2> -->	
	</view>

</template>

<script>
	import http from "@/common/http.js"
	import user from "@/common/user.js"
	import {getLastedVersion} from "@/api/index.js"
	export default {
		data() {
			return {
				currMenu: 'quan',
				noticeContent: '',
				info: {},
				charOpt: {
					padding: [15, 0, 25, 10],
					fontSize: 10
				},
				hbAmount: 0,
				lineData: {},
				charData: {},
				memberAmount: '0.00',
				systemInfo: {},
				innerAudioContext: null,
				userInfo:{amount:{}}
			}
		},
		onPullDownRefresh() {
			this.refData();
			this.getUserInfo()
		},
		onShow() {
			this.refData();
			this.getUserInfo()
			this.checkVersion()
		},
		onLoad() {
			this.systemInfo = uni.getSystemInfoSync();
			this.getVideo();
		},
		onReady() {


		},
		methods: {
			async checkVersion(){
				const res = await getLastedVersion() //{versionCode:'1001',url:'http://api.ej12366.video/618.apk'
				const vData = {
					versionCode:res.version,
					url:res.downUrl
				}
				//console.log("vData:",vData)
				plus.runtime.getProperty(plus.runtime.appid,(appInfo)=>{
					if(JSON.parse(vData.versionCode)>JSON.parse(appInfo.versionCode)){
						// 需要下载更新app
						uni.showModal({
							title: '提示',
							content:'为了更好的体验产品，请更新升级应用',//+appInfo.version+"|"+appInfo.versionCode,
							showCancel:false,
							success:(ret)=> {
								if (ret.confirm) {
									this.upload(vData.url)
								}
							}
						})
					}
					
				})
			},
			upload(updateUrl){ // 下载app
				this.toast("正在下载...")
				uni.downloadFile({
					url: encodeURI(updateUrl),
					success: (res) => {
					  if (res.statusCode === 200) {
						  const tempFilePath = res.tempFilePath;
						  this.toast('正在更新...')
						  // 安装
						  plus.runtime.install(tempFilePath, {
							  force: false
						  },
						  function() {
							  uni.hideToast();
							  plus.runtime.restart();
						  });
						  // uni.install({  
						  //   packagePath: tempFilePath  
						  // });
					  }
					}
				})
			},
			toast(title,duration=1000000){
				uni.showToast({
					title,
					icon:'none',
					duration
				});
			},
			
			jumpMemberCommodityActiveList(day) {
				uni.navigateTo({
					url: `/subPackages/gong_zuo_tai/member_commodity_active_list?day=${day}`
				})
			},
			getVideo() {
				http.request({
					url: '/api/v1/getSysDic',
					data: {
						key: 'audio'
					},
					success: ret => {

						console.log(ret)

						this.innerAudioContext = uni.createInnerAudioContext();
						this.innerAudioContext.autoplay = false;
						this.innerAudioContext.src = ret[0].dicValue


					}
				})
				
			},
			closePopup() {
				this.hbAmount = 0;
				this.$refs.popup.close()
			},
			hasShowPopup() {
				http.request({
					url: '/api/v1/getDayProfit',
					data: {
						userId: user.getUserId()
					},
					success: ret => {
						console.log(ret);
						//this.$refs.popup.open('center');
					},
					fail: ret => {
						// 不显示弹窗
						console.log(ret.errorMessage);
					}
				})
			},
			// 领取弹窗红包收益
			collectDayProfit() {
				http.request({
					url: '/api/v1/collectDayProfit',
					data: {
						userId: user.getUserId()
					},
					success: ret => {
						console.log(ret);
						this.hbAmount = ret;
						if (this.innerAudioContext) {
							this.innerAudioContext.play()
						}
						this.refData();
						uni.showToast({
							icon: "success",
							title: '领取成功'
						})
					},
					fail: ret => {
						uni.showToast({
							icon: "error",
							title: '领取失败'
						})
					}
				})
			},
			refData() {
				this.getData();
				this.getNotice();
				this.hasShowPopup();
				user.getMemberAmount(amount => {
					this.memberAmount = amount
				})
			},
			getNotice() {
				http.request({
					url: '/api/v1/getNoticeInfo',
					success: ret => {
						console.log(ret);
						let content = '';
						for (var i = 0; i < ret.length; i++) {
							content += ret[i].content + ' ';
						}
						this.noticeContent = content
					}
				})
			},
			getData() {
				http.request({
					url: '/api/v1/index',
					method: 'POST',
					data: {
						userId: user.getUserId()
					},
					success: ret => {
						uni.stopPullDownRefresh();
						this.info = ret;

						this.setLineData(this.info.statTodayTradeCountMap[0]);
						this.setCharData(this.info.statTodayActiveCountMap[0]);


					},
					fail: ret => {
						console.log(ret);
					}
				})
			},
			setLineData(arr) {
				let data = {
					categories: [],
					series: [{
						name: "交易量",
						data: []
					}]
				};
				for (let cate in arr) {
					data.categories.push(cate);
					data.series[0].data.push(arr[cate]);
				}
				this.lineData = data;
			},
			setCharData(arr) {
				let data = {
					categories: [],
					series: [{
						name: "激活量",
						data: []
					}]
				};
				for (let cate in arr) {
					data.categories.push(cate);
					data.series[0].data.push(arr[cate]);
				}
				this.charData = data;
				console.log(data);
			},
			getUserInfo() {
				user.getInfo(info => {
					this.userInfo = info;
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		padding-bottom: 0;
	}

	.xjsy {
		padding-bottom: 0;
	}

	.wzgg {
		display: flex;
		flex-direction: row;
	}

	.xjsybox {
		overflow: hidden;
	}

	.xjsybox .balance {
		flex: 1;
		display: flex;
		justify-content: center;
		position: relative;
		margin: 0 0 0 -100rpx;
	}
	.xjsybox .balance .hss{
		color: #b1b1b4;
	}
	.xjsybox .balance .sm{
		font-size: 24rpx;
		padding: 0;
	}
	.xjsybox .balance .sm.fh{
		padding: 0 10rpx;
	}

	.xjsybox .home-menu {
		justify-content: space-around;
	}

	.xjsybox .home-menu .text {
		padding: 0;
		text-align: center;
	}
	.xjsybox .home-menu .text.text2{
		color: #b1b1b4;
	}
	.xjsybox .home-menu .text .sm{
		font-size: 24rpx;
	}
	.xjsybox .home-menu .text .sm.fh{
		padding: 0 10rpx;
	}

	.get-cash-btn {
		position: absolute;
		right: -120rpx;
		top: 40rpx;
		display: block;
		text-align: left;
		padding-left: 40rpx;
		width: 170rpx;
		line-height: 58rpx;
		border-radius: 29rpx;
		font-size: 32rpx;
		color: #285EC4;
		background: #fff;
	}

	.hb-popuo {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 750rpx;
		position: relative;

		.main {
			margin-top: -100rpx;
			background-image: url("https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/hongbao.jpeg");
			background-size: cover;
			background-repeat: no-repeat;
			background-position: center;
			width: 500rpx;
			height: 600rpx;
			position: relative;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;



			.text {
				color: #fff;
				font-size: 30rpx;
				margin-bottom: 12rpx;

				&.amount {
					font-size: 40rpx;
					font-weight: 900;
				}
			}
		}

		.close {
			position: absolute;
			bottom: 150rpx;
			left: 50%;
			margin-left: -20px;
		}
	}

	.wzgg_right {
		margin-top: 6rpx;
	}
	.yqmbxo{
		display: flex;
		align-items: center;
		box-sizing: border-box;
		background: #fff;
		padding: 20rpx;
		border-radius: 20rpx;
		margin: 20rpx 0 0 0;
		.txt{
			flex: 1;
			font-size: 26rpx;
			color: #f24e4e;
		}
		.btn{
			padding: 0 15rpx;
			color: #fff;
			font-size: 14px;
			line-height: 25px;
			border-radius: 12px;
			background-image: linear-gradient(#ff8585, #f24e4e);
			text-align: center;
		}
	}
	.fhlianjie{
		display: flex;
		box-sizing: border-box;
		background: #fff;
		margin: 20rpx 0;
		border-radius: 20rpx;
		.item{
			flex: 1;
			display: flex;
			flex-flow: column;
			align-items: center;
			padding: 20rpx 0;
			.imgbox{
				width: 100rpx;
				height: 100rpx;
				.img{
					display: block;
					width: 100%;
				}
			}
			.name{
				padding: 20rpx 0 0;
				font-size: 28rpx;
				color: #285EC4;
			}
		}
	}
	
</style>
